<template>
    <!--头部区域-->
    <el-container class="home_container">
        <el-header>
            <Gj_header></Gj_header>
        </el-header>

        <!--页面主体区域-->
        <el-container>
            <el-aside width="180px">
                <Nav></Nav>
            </el-aside>
            <el-container>
                <!--右侧内容主体-->
                <el-main>
                    <Middle></Middle>
                </el-main>
                <el-footer height="30px">Footer</el-footer>
            </el-container>
        </el-container>
    </el-container>
</template>

<script>
import Nav from '../components/nav.vue'
import Gj_header from '../components/header.vue'
import Middle from '../components/middle.vue'
export default {
    name: 'Home',
    components: {
        Gj_header,
        Middle,
        Nav
    },
    methods: {
        logout() {
            // 清空token
            // window.sessionStorage.clear();
            // 跳转到登录页
            this.$router.push('/login')
        }
    }
}
</script>

<style lang="less" scoped>
.home_container {
    height: 100%;
}

.el-main {
    padding: 0;
    margin-left: 20px;
}

.el-aside {
    border-right: 1px solid #ccc;
}

.el-header {
    box-shadow: 0 5px 5px #8888;
    margin-bottom: 8px;
    margin-top: 10px;
}
.el-footer{
    text-align: center;
    margin-top: 20px;
}

//   .el-header {
//     display: flex;
//     justify-content: space-between;
//     padding-left: 0;
//     align-items: center;
//     color: #fff;
//     font-size: 20px;
//     background-color: #373d41;
//     > div {
//       display: flex;
//       align-items: center;
//       span {
//         margin-left: 25px;
//       }
//     }
//   }
//   .el-aside {
//     background-color: #333744;
//     .el-menu {
//       border-right: none;
//     }
//   }
//   .el-main {
//     padding: 0;
//     background-color: #eaedf1;

//   }
//   .iconfont {
//     margin-right: 10px;
//   }
//   .toggle_button {
//     background-color: #4a5064;
//     font-size: 10px;
//     line-height: 24px;
//     color: #fff;
//     text-align: center;
//     letter-spacing: 0.2em;
//     cursor: pointer;
//   }
</style>
